<template>
	<view>
		<view class="list">
			<view class="item">
				<view class="left">
					<image src="http://jiaoyukehu.oss-cn-beijing.aliyuncs.com/static/logo.png" mode="" class="img"></image>
				</view>
				<view class="right">
					<text class="title">通化市江南幼儿园</text>
					<view class="row">
						<image src="http://jiaoyukehu.oss-cn-beijing.aliyuncs.com/static/nursery/index/location.png" mode="" class="icon"></image>
						<text class="text">江申马路88号</text>
					</view>
					<view class="row">
						<image src="http://jiaoyukehu.oss-cn-beijing.aliyuncs.com/static/nursery/index/tel.png" mode="" class="icon"></image>
						<text class="text">184435593994</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
</script>

<style lang="scss" scoped>
	.item{
		width: mp-sizing(320);
		min-height: mp-sizing(110);
		display: flex;
		align-items: center;
		background-color: $uni-bg-color;
		box-sizing: border-box;
		padding: mp-sizing(20) mp-sizing(10);
		border-bottom: 1px solid #c8c7cc;
		box-sizing: border-box;
		.left{
			display: flex;
			height: 100%;
			justify-content: center;
			align-items: center;
			margin-right: mp-sizing(25);
			.img{
				width: mp-sizing(80);
				height: mp-sizing(80);
			}
		}
		.right{
			display: flex;
			flex-flow: column;
			height: 100%;
			justify-content: space-between;
			.title{
				font-size: mp-sizing(16);
				font-weight: 800;
				margin-bottom: mp-sizing(10);
			}
			.row{
				display: flex;
				flex-flow: row;
				align-items: center;
				margin-bottom: mp-sizing(10);
				.icon{
					width: mp-sizing(10);
					height: mp-sizing(12);
					margin-right: mp-sizing(5);
				}
				.text{
					font-size: mp-sizing(14);
					color: #8E8E8E;
				}
			}
		}
	}
</style>